<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>BetterScroll Test</title>
    <style>
        .content {
            height: 300px;
            background-color: gray;
            overflow: hidden;
        }
    </style>
</head>
<body>
    <!-- 不支持鼠标滚轮, 只支持拖拽滚动 -->
    <div class='content'>        
        <ul>
            <li>列表1</li>
            <li>列表2</li>
            <li>列表3</li>
            <li>列表4</li>
            <li>列表5</li>
            <li>列表6</li>
            <li>列表7</li>
            <li>列表8</li>
            <li>列表9</li>
            <li>列表10</li>
            <li>列表11</li>
            <li>列表12</li>
            <li>列表13</li>
            <li>列表14</li>
            <li>列表15</li>
            <li>列表16</li>
            <li>列表17</li>
            <li>列表18</li>
            <li>列表19</li>
            <li>列表20</li>
            <li>列表21</li>
            <li>列表22</li>
            <li>列表23</li>
            <li>列表24</li>
            <li>列表25</li>
            <li>列表26</li>
            <li>列表27</li>
            <li>列表28</li>
            <li>列表29</li>
            <li>列表30</li>
            <li>列表31</li>
            <li>列表32</li>
            <li>列表33</li>
            <li>列表34</li>
            <li>列表35</li>
            <li>列表36</li>
            <li>列表37</li>
            <li>列表38</li>
            <li>列表39</li>
            <li>列表40</li>
            <li>列表41</li>
            <li>列表42</li>
            <li>列表43</li>
            <li>列表44</li>
            <li>列表45</li>
            <li>列表46</li>
            <li>列表47</li>
            <li>列表48</li>
            <li>列表49</li>
            <li>列表50</li>
        </ul>
    </div>

    <script src="./bscroll.js"></script>
    <script>
        const bscroll = new BScroll('.content', {
            // mouseWheel: true,
            probeType: 3,
            pullUpLoad: true,
        })
        bscroll.on('scroll', position => { 
            // console.log(position) 
        })
        bscroll.on('pullingUp', () => { 
            console.log('上拉加载')
            // 发送网络请求

            // 网络请求完成后, 设置重新监听上拉加载
            setTimeout(() => {
                bscroll.finishPullUp()    
            }, 2000);
        })
    </script>
</body>
</html>